$(function () {
    $("#jqGrid").jqGrid({
        url: baseURL + 'exam/examsubject/list',
        datatype: "json",
        colModel: [			
			{ label: 'subjectId', name: 'subjectId', index: 'subject_id', width: 50, key: true,hidden:true },
			{ label: '题目内容', name: 'subjectContent', index: 'subject_content', width: 80 }, 			
			{ label: '题目类型', name: 'subjectType', index: 'subject_type', width: 80,
                formatter: function (cellvalue, option, rowObject) {
                    if (cellvalue === '1') {
                        return '选择'
                    }
                    return '判断'
                }
            }, 			
			{ label: '题目选项', name: 'optionList', index: 'option_list', width: 80,
                formatter: function (cellvalue, option, rowObject) {
                    let contentText = '' 
                    index = 65
                    for (let i in cellvalue) {
                        // console.log(cellvalue[i])
                        contentText += `${String.fromCharCode(index)}.${cellvalue[i].option_content}\n` 
                        index ++
                    }
                    return contentText
                }
            }, 			
			{ label: '题目答案', name: 'subjectAnswer', index: 'subject_answer', width: 80}			
        ],
		viewrecords: true,
        height: 385,
        rowNum: 10,
		rowList : [10,30,50],
        rownumbers: true, 
        rownumWidth: 25, 
        autowidth:true,
        multiselect: true,
        pager: "#jqGridPager",
        jsonReader : {
            root: "page.list",
            page: "page.currPage",
            total: "page.totalPage",
            records: "page.totalCount"
        },
        prmNames : {
            page:"page", 
            rows:"limit", 
            order: "order"
        },
        gridComplete:function(){
        	//隐藏grid底部滚动条
        	$("#jqGrid").closest(".ui-jqgrid-bdiv").css({ "overflow-x" : "hidden" }); 
        }
    });
});

var vm = new Vue({
	el:'#rrapp',
	data:{
		showList: true,
		title: null,
        optionInputText: "题目选择",
		examSubject: {
            subjectType:''
        },
        examOptionArray:[],
        optionIdList:[]
	},
    watch: {
        'examOptionArray' : function(oldVal, newVal) {
            console.log(oldVal)
            console.log(newVal)
        }
    },
    computed: {
        examOptionList: ()=>{
            const dataList = []
            for (const i in vm.examOptionArray) {
                const optionObjOne = {
                    optionId: vm.optionIdList[i],
                    optionContent: vm.examOptionArray[i]
                }
                dataList.push(optionObjOne)
   
            }
            return dataList
        }
    },
	methods: {
		query: function () {
			vm.reload();
		},
        upload:function(){
            $('#fileUploader').click()
        },
		add: function(){
			vm.showList = false;
			vm.title = "新增";
			vm.examSubject = {
                subjectType: 1,
                subjectAnswer: 1
            };
            vm.examOptionArray = []
            vm.optionIdList = []
		},
		update: function (event) {
			var subjectId = getSelectedRow();
			if(subjectId == null){
				return ;
			}
			vm.showList = false;
            vm.title = "修改";
            vm.examOptionArray = []
            vm.getInfo(subjectId)
		},
		saveOrUpdate: function (event) {
		    $('#btnSaveOrUpdate').button('loading').delay(1000).queue(function() {
                var url = vm.examSubject.subjectId == null ? "exam/examsubject/save" : "exam/examsubject/update";
                const data = {
                    "examSubjectEntity": vm.examSubject,
                    "examOptionEntityList": vm.examOptionList
                }
                console.log(vm.examOptionArray)
                console.log(data)
                $.ajax({
                    type: "POST",
                    url: baseURL + url,
                    contentType: "application/json",
                    data: JSON.stringify(data),
                    success: function(r){
                        if(r.code === 0){
                             layer.msg("操作成功", {icon: 1});
                             vm.reload();
                             $('#btnSaveOrUpdate').button('reset');
                             $('#btnSaveOrUpdate').dequeue();
                        }else{
                            layer.alert(r.msg);
                            $('#btnSaveOrUpdate').button('reset');
                            $('#btnSaveOrUpdate').dequeue();
                        }
                    }
                });
			});
		},
		del: function (event) {
			var subjectIds = getSelectedRows();
			if(subjectIds == null){
				return ;
			}
			var lock = false;
            layer.confirm('确定要删除选中的记录？', {
                btn: ['确定','取消'] //按钮
            }, function(){
               if(!lock) {
                    lock = true;
		            $.ajax({
                        type: "POST",
                        url: baseURL + "exam/examsubject/delete",
                        contentType: "application/json",
                        data: JSON.stringify(subjectIds),
                        success: function(r){
                            if(r.code == 0){
                                layer.msg("操作成功", {icon: 1});
                                $("#jqGrid").trigger("reloadGrid");
                            }else{
                                layer.alert(r.msg);
                            }
                        }
				    });
			    }
             }, function(){
             });
		},
        startUpload: function(){
            var url = "exam/examsubject/upload"
            let fd = new FormData();
			var file=$("#fileUploader")[0].files[0]
            if(file == undefined){
				// alert("请选择景点图片")
				return
			}
            fd.append('file',file);
            $.ajax({
                type: 'POST',
                url: baseURL + url,
                data: fd,
                cache: false,
                processData: false,
                contentType: false,
                success: function (ret) {
                    // alert(ret);
                    if(ret.code === 0){
                        alert("上传成功")
                    }
                }
            })
        },
		getInfo: function(subjectId){
			$.get(baseURL + "exam/examsubject/info/"+subjectId, function(r){
                vm.examSubject = r.examSubject;
                for (let i in r.examOptionList) {
                    vm.optionIdList.push(r.examOptionList[i].optionId)
                    vm.examOptionArray.push(r.examOptionList[i].optionContent)
                }
            });
		},
		reload: function (event) {
			vm.showList = true;
			var page = $("#jqGrid").jqGrid('getGridParam','page');
			$("#jqGrid").jqGrid('setGridParam',{ 
                page:page
            }).trigger("reloadGrid");
		}
	}
});
$("#fileUploader").change((val)=>{
    vm.startUpload()
})